﻿<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <div class="item2"></div>
</body>
</html>
<style>
    .item, .item2 {
        width: 50px;
        height: 50px;
        display: inline-block;
        position: absolute;
        top: 100px;
        left: 0px;
        background-color: red;
    }


    .item2 {
        top: 150px;
        left: 0px;
        transition: top 3s ease-in 1s, left 3s linear 1s;
        -webkit-transition: top 3s ease-in 1s, left 3s linear 1s;
        -moz-transition: top 3s ease-in 1s, left 3s linear 1s;
    }
</style>
<script>
window.onload = function () {
    var item2 = document.querySelector(".item2");

    item2.style.top = "0px";
    item2.style.left = "500px";
}</script>